<script setup>
import axios from 'axios'
import { ElMessage } from 'element-plus'
import { ref } from 'vue'
import router from '../../router/router'
const form = ref({
  studentName: null,
  grade: null,
  major: null,
  clazz: null,
  institute: null,
  tel: null,
  email: null,
  pwd: null,
  cardId: null,
  sex: null,
  role: 2
})

const onSubmit = () => {
  axios.post('api/studentcontroller/add', {
    studentName: form.value.studentName,
    grade: form.value.grade,
    major: form.value.major,
    clazz: form.value.clazz,
    institute: form.value.institute,
    tel: form.value.tel,
    email: form.value.email,
    pwd: form.value.pwd,
    cardId: form.value.cardId,
    sex: form.value.sex,
    role: 2
  }).then(res => {
    console.log(form.value)
    ElMessage('数据添加成功')
    router.push('/studentManage')
  })
}

const cancel = () => {
  form.value = {}
}
</script>

<template>
 <section class="add">
    <el-form  :model="form" label-width="80px">
      <el-form-item label="姓名">
        <el-input v-model="form.studentName"></el-input>
      </el-form-item>
      <el-form-item label="性别">
        <el-input v-model="form.sex"></el-input>
      </el-form-item>
      <el-form-item label="学院">
        <el-input v-model="form.institute"></el-input>
      </el-form-item>
      <el-form-item label="所属专业">
        <el-input v-model="form.major"></el-input>
      </el-form-item>
      <el-form-item label="年级">
        <el-input v-model="form.grade"></el-input>
      </el-form-item>
      <el-form-item label="班级">
        <el-input v-model="form.clazz"></el-input>
      </el-form-item>
      <el-form-item label="电话号码">
        <el-input v-model="form.tel"></el-input>
      </el-form-item>
      <el-form-item label="身份证号">
        <el-input v-model="form.cardId"></el-input>
      </el-form-item>
      <el-form-item label="邮箱">
        <el-input v-model="form.email"></el-input>
      </el-form-item>
      <el-form-item label="密码">
        <el-input v-model="form.pwd"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit()">立即创建</el-button>
        <el-button type="text" @click="cancel()">取消</el-button>
      </el-form-item>
    </el-form>
  </section>
</template>

<style scoped>
.add {
  padding: 0px 40px;
  width: 400px;
}
</style>
